<!DOCTYPE html
   PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

   <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no,mail=yes">
   <title>Index</title>

   <script src="./js/jquery-1.8.3.min.js"></script>
   <script src="./js/swiper.min.js"></script>
   <link rel="stylesheet" href="./layui/css/layui.css">
   <link rel="stylesheet" href="./css/iconfont.css">
   <link rel="stylesheet" href="./css/animate.css">
   <link rel="stylesheet" href="./css/swiper.min.css">
   <link rel="stylesheet" href="./css/common.css">
   <link rel="stylesheet" href="./css/index.css">
   <script src="./js/wow.min.js"></script>
   <script type="text/javascript" src="./js/clipboard.min.js"></script>
   <script type="text/javascript" src="./layui/layui.js"></script>
</head>

<body>
   <header class="headerpage " data-load="header"></header>
   <main class="user_page  ">
      <section class="">
         <div class="layui-main">
            <div class="user_con">
               <div class="user_headpage" data-load="user_active_header"></div>
               <div class="right_main ">

                  <p class="ft24 mb10 ft-bold">活動资讯</p>
                  <p class="ft14 gary_c9 mb20 ft-bold">开始建立活动资讯</p>
                  <div class="block_com" style="min-height: 80vh;">
                     <div class="active_w1 active3 " style="margin:  0 auto;">
                        <from class="layui-form">
                           <p class="text-align-center ft18 mb40 ft-bold">開始建立活動資訊！</p>
                           <div class="layui-upload-drag mb80 w100" style="height: 2rem;" id="ID-upload-demo-drag">
                              <div class="b1 ">

                                 <i class="layui-icon layui-icon-upload"></i>
                                 <div>就缺一張好看的活動照請上傳 1080 X 540 pixel 且小於4MB</div>
                              </div>
                              <div class="layui-hide img_box" id="ID-upload-demo-preview">
                                 <img src="" alt="上传成功后渲染">
                              </div>
                           </div>
                           <div class="layui-form-item">
                              <div class="label must">主辦單位名稱</div>
                              <div class="">
                                 <input type="text" name="username" lay-verify="required" placeholder="请填写主办单位"
                                    autocomplete="off" class="layui-input">
                              </div>
                           </div>
                           <div class="layui-form-item">
                              <div class="label must">活動名稱
                              </div>
                              <div class="">
                                 <input type="text" name="username" lay-verify="required" placeholder="请填写活動名稱"
                                    autocomplete="off" class="layui-input">
                              </div>
                           </div>
                           <div class="layui-form-item">
                              <div class="label must">活動時區
                              </div>
                              <div class="">
                                 <select name="interest" lay-filter="aihao">
                                    <option value=""></option>
                                 </select>
                              </div>
                           </div>
                           <div class="layui-form-item">
                              <div class="label must">活動時間<p class=" tip1">開始時間</p>
                              </div>
                              <div class="d-flex">
                                 <input id="datetime-1" type="text" name="username" lay-verify="required"
                                    placeholder="请填写開始時間" autocomplete="off" class="layui-input">

                              </div>
                              <p class=" tip1 mb10">結束時間</p>
                              <div class="d-flex">
                                 <input id="datetime-1" type="text" name="username" lay-verify="required"
                                    placeholder="请填写結束時間" autocomplete="off" class="layui-input">

                              </div>
                           </div>

                           <div class="layui-form-item">
                              <div class="label ">活動標籤<p class=" tip1">為活動設定標籤讓使用者更容易找到你，上限五個</p>
                              </div>
                              <div class="">
                                 <select name="interest" lay-filter="aihao">
                                    <option value=""></option>
                                 </select>
                              </div>
                           </div>
                           <div class="layui-form-item">
                              <div class="label ">活動短網址<p class=" tip1">為活動取一個簡單好記的短網址</p>
                              </div>
                              <div class="">
                                 <select name="interest" lay-filter="aihao">
                                    <option value=""></option>
                                 </select>
                              </div>
                           </div>
                           <div class="layui-form-item">
                              <div class="label ">參考網站<p class=" tip1">加上參考網站如 Facebook 或 Instagram，讓使用者更認識你</p>
                              </div>
                              <div class="">
                                 <select name="interest" lay-filter="aihao">
                                    <option value=""></option>
                                 </select>
                              </div>
                           </div>
                           <div class="layui-form-item">
                              <div class="label ">活動幣別<p class=" tip1">請注意！活動舉辦後將無法更改</p>
                              </div>
                              <div class="">
                                 <input type="text" name="username" lay-verify="required" placeholder="参考网站描述，建议20个字以内"
                                    autocomplete="off" class="layui-input mb12">
                                 <input type="text" name="username" lay-verify="required"
                                    placeholder="HTTPS//WWW/BAIDU.COM" autocomplete="off" class="layui-input">
                              </div>
                           </div>
                           <div class="layui-form-item">
                              <div class="label must">活動地點</p>
                              </div>
                              <div class="">
                                 <div class="mb12">
                                    <select name="interest" class="" lay-filter="aihao">
                                       <option value="">中国</option>
                                    </select>
                                 </div>

                                 <input type="text" name="username" lay-verify="required" placeholder="详细地址"
                                    autocomplete="off" class="layui-input mb12">
                                 <input type="text" name="username" lay-verify="required" placeholder="补充说明"
                                    autocomplete="off" class="layui-input">
                              </div>
                           </div>
                           <div class="mt40 d-flex jc-s al-c">
                              <button class="layui-btn layui-btn-lg w100 layui-bg-orange next-btn">储存</button>
                           </div>
                        </from>

                     </div>
                  </div>
               </div>
            </div>
      </section>
   </main>

</body>
<script src="./js/index.js"></script>
<script>	layui.use(function () {
      var upload = layui.upload;
      var layer = layui.layer;
      var element = layui.element;
      var $ = layui.$;
      var laydate = layui.laydate;

      upload.render({
         elem: '#ID-upload-demo-drag',
         url: '', // 实际使用时改成您自己的上传接口即可。
         done: function (res) {
            layer.msg('上传成功');
            $('#ID-upload-demo-drag .b1').addClass('layui-hide')
            $('#ID-upload-demo-preview').removeClass('layui-hide')
               .find('img').attr('src', res.files.file);
            console.log(res)
         }
      });
      laydate.render({
         elem: '#datetime-1',
         type: 'datetime',
         fullPanel: true // 2.8+
      });
   })
</script>

</html>